<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core">
    <ui:composition template="/template.xhtml">
        <ui:define name="body">
            <script type="text/javascript">
                function plus()
                {
                    ++(document.getElementById("quantityInput").value);
                    (document.getElementById("prixTotal").value) = (document.getElementById("quantityInput").value) * (document.getElementById("prixUnitaire").value);
                }
                function moins()
                {
                    --(document.getElementById("quantityInput").value);
                    (document.getElementById("prixTotal").value) = (document.getElementById("quantityInput").value) * (document.getElementById("prixUnitaire").value);
                }
            </script>
            <div id="ficheLivre">
                <h:form id="form">
                    <div id="hautLivre">
                        <h4>Livraison offerte en Colissimo et/ou en point RELAIS COLIS des 15€ d'achat</h4>
                    </div>
                    <fieldset id="couverture">
                        <h:graphicImage value="/images/detail#{bookManagedBean.book.bitmapURL}" width="200" height="300" />
                    </fieldset>
                    <div id="gaucheLivre">
                        <h:panelGrid>
                            <h:outputText value="#{bookManagedBean.book.title}"/> 
                            <ui:repeat var="a" value="#{bookManagedBean.book.authorList}">
                                <h:outputText value="De #{a.firstName} #{a.lastName} "/><br/>
                            </ui:repeat>

                            <h:outputText value="#{bundle.CreateBookLabel_summary}"/>
                            <p><h:outputText value="#{bookManagedBean.book.summary}"/></p>
                            <a href="book.xhtml#tab1">Lire la suite</a>
                            <h:outputFormat value="#{bundle.ViewBookTitle_publicationDate}"/>
                            <h:outputText value="#{CommonHelper.convertString(bookManagedBean.book.publicationDate)}">
                                <f:convertDateTime dateStyle="long" pattern="MMMM yyyy" />
                            </h:outputText>
                        </h:panelGrid>
                        <div class="priceArea">
                            <div id="prix">
                                <fieldset class="quantity">
                                    <label id="qte" for="quantityInput">Quantité(s)</label>
                                    <a class="quantityMore"><h:graphicImage onclick='plus()' title="plus" value="/resources/img/plus.png"/></a>
                                    <input id="quantityInput" name="quantityItem" title="quantité"/>
                                    <a class="quantityLess" ><h:graphicImage onclick='moins()' title="moins" value="/resources/img/moins.png"/></a>
                                </fieldset>
                            </div><br/>
                            <div class="contentArea">
                                <p class="mainCondition">
                                    <h:outputText value="#{wsManagedBean.getStockBookByISBN(b.isbn)}" />
                                   
                                </p>                    
                            </div>
                            <input id="prixUnitaire" value="#{bookManagedBean.book.price}" type ="hidden" title="Prix"/>
                            <div class="basketArea">
                                <ins> <input id="prixTotal" value="#{bookManagedBean.book.price}" title="Prix"/></ins> <br/>
                                <h:commandButton class="btn" value="Ajouter au panier &raquo;" actionListener="#{mbCart.addItemToCart()}">
                                    <f:param name="isbn" value="#{b.isbn}"/>
                                    <!--<f:param name="quantityItem" value="1"/>-->
                                </h:commandButton>
                            </div>
                        </div>
                    </div>
                <br/><br/>
                <fieldset>
                    <div class="tabbable"> 
                        <ul class="nav nav-tabs">
                            <li class="active">
                                <a href="#tab1" data-toggle="tab"><span> Descriptif </span></a>
                            </li>
                            <li><a href="#tab2" data-toggle="tab"><span> Fiche technique </span></a></li>
                            <li><a href="#tab3" data-toggle="tab"><span> Avis client </span></a></li>
                        </ul>
                        <div class="tab-content" >
                            <div class="tab-pane active" id="tab1">       
                                <ul>
                                    <li>#{bookManagedBean.book.summary}</li>
                                </ul>
                            </div>
                            <div class="tab-pane active" id="tab2">       
                                <ul>    
                                    <li><strong>Editeur(s) :</strong>
                                        <ui:repeat value="#{bookManagedBean.book.publisherList}" var="p">
                                            <h:outputText value=" #{p.label} "/>
                                        </ui:repeat>
                                    </li>
                                    <li>
                                        <strong>Auteur(s) :</strong>
                                        <ui:repeat var="a" value="#{bookManagedBean.book.authorList}">
                                            <h:outputText value="#{a.firstName} #{a.lastName} "/>
                                        </ui:repeat>
                                    </li>
                                    <li><strong>Titre :</strong><h:outputText value=" #{bookManagedBean.book.title} "/></li>
                                    <li><strong>Categorie(s) :</strong><h:outputText value=" #{bookManagedBean.book.categoryid.label} "/></li>
                                    <li><strong>Série :</strong><h:outputText value=" #{bookManagedBean.book.seriesid.label} "/></li>
                                    <li>
                                        <strong>Collection :</strong>
                                        <ui:repeat var="c" value="#{bookManagedBean.book.collectionList}">
                                            <h:outputText value=" #{c.label} "/>
                                        </ui:repeat>
                                    </li>
                                    <li><strong>Date de parution :</strong><h:outputText value=" #{CommonHelper.convertString(bookManagedBean.book.publicationDate)} "/></li>
                                </ul>
                            </div>
                            <div class="tab-pane active" id="tab3">       
                                <ul>
                                    <li>
                                        <p>
                                            Ici reposent les commentaires des clients !!!!!
                                        </p>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </fieldset>
                </h:form>
            </div>
        </ui:define>
    </ui:composition>
</html>
